<template>
  <div>
    <van-form @submit="onSubmit">
      <van-field label="用户名" placeholder="请输入用户名" v-model="user.name"
      :rules="[{ pattern:regNamePwd,require:true,message:'用户名错误！'}]">
      </van-field>
      <van-field label="密码" placeholder="请输入密码" type="password" v-model="user.pwd"
      :rules="[{ pattern:regNamePwd,require:true,message:'密码格式错误！'}]"></van-field>
      <van-field label="确认密码" placeholder="请确认密码" type="password" v-model="user.ispwd"
       :rules="[{ pattern:regNamePwd,require:true,message:'密码格式错误！'}]"></van-field>
      <van-field label="邮箱" placeholder="请输入邮箱" type="email" v-model="user.email"
      :rules="[{ pattern:regEmail,require:true,message:'邮箱号错误！'}]"></van-field>
      <van-field label="电话" placeholder="请输入电话" type="tel" v-model="user.phone"
      :rules="[{ pattern:regPhone,require:true,message:'电话格式错误！'}]"></van-field>
      <van-button round block type="info" native-type="submit">提交</van-button>
    </van-form>

  </div>
</template>

<script>
  export default {
    name: "register",
    data() {
      return {
        user: {
          name: "",
          pwd: "",
          ispwd: "",
          email: "",
          phone: ""
        },
        regNamePwd: /^[a-z0-9]{3,12}$/i,
        regPhone: /^((13[0-9])|(14[5|7])|(15([0-3]|[5-9]))|(18[0,5-9]))\d{8}$/,
        regEmail: /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/,
      }
    },
    methods:{
      onSubmit(){
        if(this.user.ispwd!=this.user.pwd){
          this.$toast("两次密码不一致！");
          return;
        }
      }
    }
  }
</script>

<style>
</style>
